<!DOCTYPE html>
<html lang="zh-CN" style="color-scheme: dark;" xmlns="http://www.w3.org/1999/html">
<head>
    <link rel="stylesheet" href="./css/timeline.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link
            href="https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap&family=Ma+Shan+Zheng"
            rel="stylesheet"
    >
    <!-- SweetAlert2 CSS -->
    <link href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css" rel="stylesheet">
</head>
<body>
<div class="entries">
    <div class="entry">
        <div class="time-title">4000年前</div>
        <div class="time-body">
            <h4 onclick="parentSwal('远古时代')">远古时代</h4>
            <p>
                中国远古时代指的是夏、商、周以前的时代,距今4000年以上,在中国,重庆市巫山县发现的"巫山人"化石,有200万年的历史
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">约公元前21世纪 ~ 16世纪</div>
        <div class="time-body">
            <h4 onclick="parentSwal('夏朝')">夏朝</h4>
            <p>
                中国史书中记载的第一个世袭制朝代。夏时期的文物中有一定数量的青铜和玉制的礼器，年代约在新石器时代晚期、青铜时代初期，一般认为夏朝是多个部落联盟或复杂酋邦形式的国家。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">公元前1600 ~ 1046年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('商朝')">商朝</h4>
            <p>中国历史上的第二个朝代，是中国第一个有直接的同时期的文字记载的王朝。</p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">公元前1046 ~ 771年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('西周')">西周</h4>
            <p>“西周”除了朝代名，还是东周时期的国家名称，即西周侯国（前367－前256），是战国末年周王室分裂的产物。</p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">公元前770年－256年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('东周列国')">东周列国</h4>
            <p>东周的前半期，诸侯争相称霸，称为春秋时代。公元前453年，韩赵魏三家联手灭智氏家族后，三家分晋，各诸侯相互征伐，称为战国时代。</p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title big">公元前221－207</div>
        <div class="time-body">
            <h4 onclick="parentSwal('秦朝')">秦朝</h4>
            <p>
                由战国时期的秦国发展起来的中国历史上第一个大一统王朝，秦人的祖先大费是黄帝之孙颛顼的后裔，舜赐其嬴姓。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">公元前202年－8年12月</div>
        <div class="time-body">
            <h4 onclick="parentSwal('西汉')">西汉</h4>
            <p>
                中国历史上继秦朝之后的大一统王朝，共历十二帝，享国二百一十年，又称为前汉。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">25年－220年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('东汉')">东汉</h4>
            <p>
                中国历史上继西汉之后又一个大一统的中原王朝，传八世共十四帝，享国一百九十五年，与西汉统称汉朝。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">220年－280年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('三国')">三国</h4>
            <p>
                上承东汉下启西晋的一段历史时期，分为曹魏、蜀汉、东吴三个政权。赤壁之战时，曹操被孙刘联军击败，奠定了三国鼎立的雏型。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">公元266年—公元316年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('西晋')">西晋</h4>
            <p>
                中国历史上三国时期之后的大一统王朝之一，另与东晋合称晋朝。传四帝，国祚五十一年。若以灭东吴始，则仅立朝37年。为了区别于东晋，史称西晋，两晋又被称为司马晋。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">317年－420年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('东晋')">东晋</h4>
            <p>
                由西晋宗室司马睿南迁后建立起来的政权，建都洛阳的西晋覆亡，史称东晋，此外，史书中又仿东汉称中汉，称东晋为中晋，寓以晋室中兴之意；又东晋统治地区大部分在江东，古称江左，因此以江左代指东晋。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">420年—589年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('南北朝')">南北朝</h4>
            <p>
                南朝和北朝的统称。南北朝时期是中国历史上的一段大分裂时期，也是中国历史上的一段民族大融合时期，上承东晋十六国下接隋朝，由公元420年刘裕代东晋建立刘宋始，至公元589年隋灭陈而终。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">581年—619年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('西汉')">隋朝</h4>
            <p>
                中国历史上承南北朝下启唐朝的大一统朝代，也是是五胡乱华后汉族重新建立的大一统朝代。隋文帝之父杨忠，曾被北周封为“随国公”。杨坚世袭爵位，即位后立国号为“随”，但其认为“随”有走的意思，恐不祥遂改为“隋”。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title big">618年—907年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('唐朝')">唐朝</h4>
            <p>
                继隋朝之后的大一统中原王朝，共历二十一帝，享国二百八十九年。唐朝是当时世界上最强盛的国家之一，声誉远播，与亚欧国家均有往来。唐以后海外华人多自称为唐人。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">907年—979年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('五代十国')">五代十国</h4>
            <p>
                中国历史上的一段大分裂时期。这一称谓出自《新五代史》，是对五代（907年—960年）与十国（902年—979年）的合称。五代是指在中原一带相继建立的后梁、后唐、后晋、后汉、后周五个政权；十国是指在南方建立的吴国、南唐、吴越、闽、南汉、前蜀、后蜀、楚、南平、北汉十个政权。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">960年—1279年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('西汉')">宋辽金</h4>
            <p>
                我国封建经济继续发展、并出现衰落的阶段。前后经历了319年。这一时期先后出现了几个并立的民族政权，封建生产方式逐渐向边疆地区扩展。最后，元朝统一了中国，建立了幅员辽阔的多民族政权国家。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">1271年—1368年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('元朝')">元朝</h4>
            <p>
                由蒙古族建立，是中国历史上首次由少数民族建立的大一统王朝。定都大都（今北京），传五世十一帝，历时九十八年。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">1368年―1644年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('明朝')">明朝</h4>
            <p>
                是一个由汉族建立的大一统王朝，共传十六帝，享国二百七十六年。
            </p>
        </div>
    </div>
    <div class="entry">
        <div class="time-title">1636年—1912年</div>
        <div class="time-body">
            <h4 onclick="parentSwal('清朝')">清朝</h4>
            <p>
                中国历史上最后一个封建王朝，共传十二帝，从皇太极改国号为清开始，国祚276年。从努尔哈赤建立后金政权起，总计296年。从清兵入关，建立全国性政权算起为268年。
            </p>
        </div>
    </div>
</div>

<!-- 引入 SweetAlert2 JS -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.js"></script>
<script src="js/timeline-child.js"></script>
</body>
</html>
